.vue-tree {
  list-style: none;
  padding: 0;
  margin: 0;
  
  .tree-item {
    cursor: pointer;
    transition: background-color 0.2s;
    width: 100%!important;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    line-height: 32px;
    .tree-content {
      position: relative;
      padding-left: 28px;
      &:hover {
        background-color: #f9f9fb;
        color: #30329c;
      }
    }
    .expand-arrow {
      position: absolute;
      top: 2px;
      left: 4px;
      width: 22px;
      height: 22px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      cursor: pointer;
      -webkit-transition: 0.2s;
      transition: 0.2s;
      -webkit-transform-origin: center;
      transform-origin: center;
      font-size: 9px;
      z-index: 2;
      transform: rotate(-90deg);
      i {
        width: 100%;
        height: 100%;
        vertical-align: middle;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      // &::after {
      //   position: absolute;
      //   top: 50%;
      //   left: 50%;
      //   display: block;
      //   content: " ";
      //   border-width: 6px;
      //   border-style: solid;
      //   border-color: transparent;
      //   border-left-color: #21252e;
      //   margin: -5px 0 0 -2.5px;
      //   transition: all 0.2s;
      //   z-index: 3;
      // }
    }
    &.expand {
      & > .tree-content {
        background-color: #f2f2f5;
        color: #30329c;
        & > .expand-arrow {
          transform: rotate(0deg);
        }
      }
    }
    .vue-tree-select {
      color: #30329c;
    }
    .tree-label {
      height: 28px;
      line-height: 28px;
      font-size: 12px;
    }
    .sub-tree {
      display: none;
      list-style: none;
      padding: 0 0 0 16px;
      margin: 0;
      position: relative;

      .tree-label {
        &::before {
          position: absolute;
          left: 0px;
          width: 1px;
          height: 100%;
          height: 100%;
          margin: 22px 0 0;
          border-left: 1px solid #ebecef;
          content: " ";
          top: -22px;
        }
        &::after {
          position: absolute;
          left: 0px;
          width: 18px;
          height: 100%;
          height: calc(100% - 22px);
          margin: 22px 0 0;
          border-bottom: 1px solid #ebecef;
          content: " ";
          top: -15px;
        }
      }
      .tree-label.no-child {
        &::after {
          width: 22px;
        }
      }
 
   
    }
    &.expand > .sub-tree {
      display: block;
    }
    &.no-child {
      & > .tree-content {
        /*padding-left: 0;*/
        & > .expand-arrow {
          display: none;
        }
      }
    }
  }
}
.tag-box-ul li:last-child{
    >.tree-content{
      .tree-label{
        &::before {

          top: -36px;
        }
      }
    }

}